<template>
  <div>
    <el-row justify="center" class="custom-height">
      <el-col align="middle" :span="6">
        <el-button type="warning" @click="clickIntelligenceType(1)">汇总</el-button>
      </el-col>
      <el-col align="middle" :span="6">
        <el-button type="warning" @click="clickIntelligenceType(2)">桥隧涵保养修</el-button>
      </el-col>
      <el-col align="middle" :span="6">
        <el-button type="warning" @click="clickIntelligenceType(3)">线路保养修</el-button>
      </el-col>
      <el-col align="middle" :span="6">
        <el-button type="warning" @click="clickIntelligenceType(4)">信号维修</el-button>
      </el-col>
    </el-row>
    <el-row>
      <el-table :key="Math.random()" :data="intelligenceList" :height="heightTable" border>
        <el-table-column label="序号" type="index" width="55px"></el-table-column>
        <!-- <el-table-column label="任务id" prop="taskId"></el-table-column> -->
        <el-table-column label="施工内容" v-if="props.TableType.indexOf('施工内容') != -1" prop="maintainContent"> </el-table-column>
        <el-table-column label="维修内容" v-if="props.TableType.indexOf('维修内容') != -1" prop="maintainContent"> </el-table-column>
        <el-table-column label="影响范围" prop="influenceScope"> </el-table-column>
        <el-table-column
          label="施工类型"
          v-if="props.TableType.indexOf('施工类型') != -1 && (allTableShow || linesAndTurnoutsTableShow)"
          prop="maintainType"
        >
        </el-table-column>
        <el-table-column
          label="维修类型"
          v-if="props.TableType.indexOf('维修类型') != -1 && (allTableShow || linesAndTurnoutsTableShow)"
          prop="maintainType"
        >
        </el-table-column>
        <el-table-column v-if="allTableShow || linesAndTurnoutsTableShow" label="行别" prop="progressType"> </el-table-column>
        <el-table-column v-if="bridgesTunnelsCulvertsTableShow" label="桥隧涵名称" prop="btcName"> </el-table-column>
        <el-table-column
          v-if="bridgesTunnelsCulvertsTableShow || linesAndTurnoutsTableShow || signalMaintenanceTableShow"
          label="工区"
          prop="workArea"
        >
        </el-table-column>
        <el-table-column v-if="bridgesTunnelsCulvertsTableShow" label="中心里程" prop="centerMileage"> </el-table-column>
        <el-table-column v-if="bridgesTunnelsCulvertsTableShow" label="全长" prop="totalLength"> </el-table-column>
        <el-table-column
          v-if="bridgesTunnelsCulvertsTableShow || linesAndTurnoutsTableShow || signalMaintenanceTableShow"
          label="线路名称"
          prop="railwayName"
        >
        </el-table-column>
        <el-table-column v-if="signalMaintenanceTableShow" label="设备名称" prop="unscheduledMaintain"> </el-table-column>
        <el-table-column label="未排期的维修数量" prop="unscheduledMaintain"> </el-table-column>
        <el-table-column label="未排期的维修地段" prop="unscheduledMaintainDistrict"> </el-table-column>
        <el-table-column label="维修优先级" prop="maintainPriority"> </el-table-column>
        <el-table-column label="建议维修时间" prop="maintainTime"> </el-table-column>
        <el-table-column label="备注" prop="remark">
          <template #default="scope">
            <span v-if="scope.row.remark?.length <= 20">
              {{ scope.row.remark }}
            </span>
            <span v-else-if="!scope.row.remark?.length"> --- </span>
            <span v-else>
              <el-popover effect="dark" placement="top-start" :width="400" trigger="hover" :content="scope.row.remark">
                <template #reference> {{ scope.row.remark?.slice(0, 20) }}... </template>
              </el-popover>
            </span>
          </template>
        </el-table-column>
        <el-table-column label="最后更新时间" prop="updateTime"> </el-table-column>
      </el-table>
    </el-row>
    <!-- 桥隧涵保养修显示 -->
  </div>
</template>

<script setup name="intelligence">
import { VueElement } from "vue";
import tree from "./tree.vue";
const props = defineProps({
  TableType: {
    type: Array,
    default: [],
  },
  DragType: {
    type: String,
    default: "",
  },
  formaConstructionContentList: {
    type: Function,
    default: () => {},
  },
  heightTable: {
    type: String,
    default: "60vh",
  },
  workAreaTree: {
    type: Object,
    default: {},
  },
  typeList: {
    type: String,
    default: "",
  },
  btcNameStr: {
    type: String,
    default: "",
  },
});
const emit = defineEmits(["intelligenceFun"]);
import { selectProIntelligentRecommendationPoolListapi } from "@/api/main/api.js";
const data = reactive({
  //查询
  paramsintel: {
    type: "",
  },
  intelligenceList: [],
  //总汇显示
  allTableShow: true,
  ///桥隧涵保养修显示
  bridgesTunnelsCulvertsTableShow: false,
  //线路保养修显示
  linesAndTurnoutsTableShow: false,
  //信号维修显示
  signalMaintenanceTableShow: false,
});
const { intelligenceList, allTableShow, bridgesTunnelsCulvertsTableShow, linesAndTurnoutsTableShow, signalMaintenanceTableShow, paramsintel } =
  toRefs(data);
//维修智能推荐池
function getList1(type) {
  switch (type) {
    case 1:
      paramsintel.value.type = "";
      selectProIntelligentRecommendationPoolListapi(paramsintel.value).then((res) => {
        if (res.code == 200) {
          intelligenceList.value = res.data;
        }
      });
      break;
    case 2:
      paramsintel.value.type = "桥隧涵保养修";
      selectProIntelligentRecommendationPoolListapi(paramsintel.value).then((res) => {
        if (res.code == 200) {
          intelligenceList.value = res.data;
        }
      });
      break;
    case 3:
      paramsintel.value.type = "线路保养修";
      selectProIntelligentRecommendationPoolListapi(paramsintel.value).then((res) => {
        if (res.code == 200) {
          intelligenceList.value = res.data;
        }
      });
      break;
    case 4:
      paramsintel.value.type = "信号保养修";
      selectProIntelligentRecommendationPoolListapi(paramsintel.value).then((res) => {
        if (res.code == 200) {
          intelligenceList.value = res.data;
        }
      });
      break;
  }
}
getList1(1);
//选择上面类型按钮
function clickIntelligenceType(intelligenceType) {
  switch (intelligenceType) {
    case 1:
      //填写查询方法
      getList1(1);
      this.allTableShow = true;
      this.bridgesTunnelsCulvertsTableShow = false;
      this.linesAndTurnoutsTableShow = false;
      this.signalMaintenanceTableShow = false;
      break;
    case 2:
      //填写查询方法
      getList1(2);
      this.allTableShow = false;
      this.bridgesTunnelsCulvertsTableShow = true;
      this.linesAndTurnoutsTableShow = false;
      this.signalMaintenanceTableShow = false;
      break;
    case 3:
      //填写查询方法
      getList1(3);
      this.allTableShow = false;
      this.bridgesTunnelsCulvertsTableShow = false;
      this.linesAndTurnoutsTableShow = true;
      this.signalMaintenanceTableShow = false;
      break;
    case 4:
      //填写查询方法
      getList1(4);
      this.allTableShow = false;
      this.bridgesTunnelsCulvertsTableShow = false;
      this.linesAndTurnoutsTableShow = false;
      this.signalMaintenanceTableShow = true;
      break;
  }
}
</script>
<style scoped lang="scss">
.custom-height {
  height: 50px;
  /* 设置自定义高度 */
}
</style>
